<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport"
        content="width=device-width, initial-scale=1, maximum-scale=1,minimum-scale=1, user-scalable=no" />
    <title>login</title>
    <link rel="shortcut icon" href="./img/logo.png" type="image/x-icon">
    <link rel="stylesheet" href="./css/common.css" />
    <link rel="stylesheet" href="./css/login.css" />
    <script src="./js/iconfont.js"></script>
    <script src="./js/rem.js"></script>
    <script src="./js/axios.js"></script>
    <script src="./js/request.js"></script>

</head>

<body>
    <div id="app">
        <div class="top">家装家居网</div>
        <div class="login-box">
            <div class="form-item">
                <label for="name">name</label>
                <div>
                    <input type="text" id="name" />
                </div>
            </div>
            <div class="form-item">
                <label for="pass">pass</label>
                <div><input type="text" id="pass" /></div>
            </div>
            <div class="form-item">
                <label for="submit"></label>
                <div><input type="button" id="submit" value="登录" /></div>
            </div>
        </div>
    </div>
    <script src="./js/login.js"></script>

    <script>
        let submit = document.getElementById("submit");
        submit.addEventListener(
            "click",
            async (e) => {
                    let name = document.getElementById("name").value;
                    let pass = document.getElementById("pass").value;
                    let options = {
                        url: 'users/login',
                        type: 'post',
                        data: {
                            name,
                            pass
                        },
                    }
                    let res = await request(options)
                    //判断网络传输是否正常
                    if (res.status !== 200) {
                        return alert("登录失败");
                    }
                    // 判断是否正确的用户名和密码
                    if(res.data.code!==200){
                        return alert(res.data.msg)
                    }
                    sessionStorage.setItem("user-login", JSON.stringify(res.data));
                    location = "caseList.html";
                },
                false
        )
    </script>
</body>

</html>